import React from 'react'
import injectSheet from 'react-jss'
import styles from '@/page/Index/styles'
import { Layout, Button, } from 'antd'
import { Link, } from 'react-router-dom'
import https from '@/assets/https'
import base64 from 'base-64'
import qs from 'qs'

const { Header, Footer, Content } = Layout

class Index extends React.Component {
  state = {
    token_type: '',
    access_token: '',
  }

  oauth = () => {
    https('/access/token', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
        'Authorization': `Basic ${base64.encode('ms-book:defore')}`
      },
      body: qs.stringify({grant_type: 'password', username: 'defore', password: '123456'}),
    })
      .then(result => {
        console.log(result)
        this.setState({
          token_type: result.token_type,
          access_token: result.access_token,
        })
      })
  }

  authorize = () => {
    
  }

  authenticate = () => {
    https('/access/authenticate', {
      headers: {
        'Authorization': `${this.state.token_type} ${this.state.access_token}`,
      },
    })
      .then(result => {
        console.log(result)
      })
  }

  render() {
    const { classes } = this.props
    return (
      <Layout>
        <Header className={classes.AppHeader}>
          <div className={classes.Logo}></div>
        </Header>
        <Content className={classes.AppBody}>
          <div>
            主页内容
            <Link to="/topic">topic</Link>
            <br />
            <Button onClick={this.oauth}>授权</Button>
            <br />
            <Button onClick={this.authenticate}>验证请求authenticate</Button>
            <br />
            <Button onClick={this.authorize}>authorize</Button>
          </div>
        </Content>
        <Footer className={classes.AppFooter}>
          MS Blog ©2018 Created by Defore
        </Footer>
      </Layout>
    )
  }
}

export default injectSheet(styles)(Index)
